<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>计算器</title>
  <style>
    body { font-family: sans-serif; text-align: center; margin-top: 100px; }
    input, select, button { padding: 10px; font-size: 16px; margin: 5px; }
  </style>
</head>
<body>
  <h1>🧮 简易计算器</h1>
  <input id="num1" type="number" placeholder="数字1">
  <select id="op" title="选择运算操作符">
    <option value="+">+</option>
    <option value="-">−</option>
    <option value="*">×</option>
    <option value="/">÷</option>
  </select>
  <input id="num2" type="number" placeholder="数字2">
  <button onclick="calc()">计算</button>
  <p id="result"></p>

  <script>
    function calc() {
      const n1 = parseFloat(document.getElementById("num1").value);
      const n2 = parseFloat(document.getElementById("num2").value);
      const op = document.getElementById("op").value;
      let res = "";

      if (isNaN(n1) || isNaN(n2)) {
        res = "请输入两个有效数字";
      } else {
        switch (op) {
          case "+": res = n1 + n2; break;
          case "-": res = n1 - n2; break;
          case "*": res = n1 * n2; break;
          case "/": res = n2 !== 0 ? (n1 / n2).toFixed(2) : "不能除以0"; break;
        }
      }
      document.getElementById("result").textContent = "结果：" + res;
    }
  </script>
</body>
</html>
